<!-- Created by duwanfu on 2018/12/1 -->
<template>
  <div class="wraper">
    <div class="content">
      <mt-field placeholder="请输入手机号" :attr="{ maxlength: 11 }" type="tel" v-model="phone"></mt-field>
      <mt-button>立即注册</mt-button>
    </div>
  </div>
</template>

<script>
  export default {
    name: "landing",
    data() {
      return {
        phone: '',
      }
    },
    created() {
      // let that = this;
      // window.addEventListener('resize',function () {
      //   console.log(1);
      //   that.data = document.body.scrollTop
      // })
    },
    methods: {
    },
  }
</script>

<style lang="scss" scoped>
  .wraper {
    position: relative;
    width: 100vw;
    height: 13.38rem;
    /*min-height: 100vh;*/
    background: url("../../assets/imgs/landing-bg.png") no-repeat;
    background-size: 100vw 13.38rem;
    .content {
      position: absolute;
      width: 80%;
      bottom: 2.2rem;
      left: 50%;
      transform: translateX(-50%);
      .mint-field {
        height: 1rem;
        margin-bottom: .5rem;
        border-radius: .1rem;
      }
      .mint-button {
        width: 100%;
        height: 1rem;
        color: #000;
        background: linear-gradient(top, #ffe98b, #ffdb43);
      }
    }
  }
</style>
